import React, { render, Component } from "./react"
const root = document.getElementById("root")
const jsx = (
  <div>
    <p>hello react</p>
    <p>hi fiber</p>
  </div>
)
// render(jsx, root)

// setTimeout(() => {
//   const jsx = (
//     <div>
//       <p>21321321</p>
//       {/* <p>21321 fiber</p> */}
//     </div>
//   )
//   render(jsx, root)
// }, 2000)

class Greating extends Component {
  constructor (props) {
    super(props)
    this.state = {
      name: '张三'
    }
  }
  render () {
    return (
      <div>
        <div>xxxxxxxx, {this.props.title}, {this.state.name}</div>
        <button onClick={() => this.setState({name: "李四"})}>change</button>
      </div>
    )
  }
}
render(<Greating title="hellow"></Greating>, root)

// function FnComponent (props) {
//   return <div>FnComponent, {props.title}</div>
// }
// render(<FnComponent title="hellow"></FnComponent>, root)
